<template><el-container>
	<el-header class="header">
		<Header />
	</el-header>
	<el-container>
		<el-aside width="200px">
			<navigator></navigator>
		</el-aside>
		<el-main style="padding-top: 10px">
			<el-row>
				<el-col :span="23" :offset="1">
					<el-table :data="receiptList" class="content">
						<el-table-column prop="id" label="票据编号" min-width="10%"></el-table-column>
						<el-table-column prop="senderAddress" label="发送人地址" min-width="30%"></el-table-column>
						<el-table-column prop="accepterAddress" label="接收人地址" min-width="30%"></el-table-column>
						<el-table-column prop="amount" label="交易量" min-width="10%"></el-table-column>
						<el-table-column prop="receiptType" label="票据类型" min-width="10%">
							<template slot-scope="scope">
								<el-tag v-if="scope.row.receiptType == 1" type="success">存证</el-tag>
								<el-tag v-else type="danger">现金</el-tag>
							</template>
						</el-table-column>
						<el-table-column prop="transferType" label="交易类型" min-width="10%">
							<template slot-scope="scope">
								<el-tag v-if="scope.row.transferType == 1" type="success">银行转账给公司</el-tag>
								<el-tag v-else-if="scope.row.transferType == 2" type="danger">公司与公司间转账</el-tag>
								<el-tag v-else type="warning">公司转账给银行</el-tag>
							</template>
						</el-table-column>
					</el-table>
				</el-col>
			</el-row>
		</el-main>
	</el-container>
</el-container></template>

<script>
import Navigator from '@/components/Navigator'
import Header from '@/components/Header'

export default {
	name: 'Home',
	data() {
		return {
			receiptList: [],
		}
	},
	components: {
		Navigator,
		Header,
	},
	methods: {
		query() {
			let address = this.$cookies.get('address')
			this.$axios.get('/finance/query/listAllReceipt?address=' + address).then((response) => {
				console.log(response)
				if (response.code == 200) {
					this.receiptList = response.data
				}
			})
		},
	},
	mounted() {
		this.query()
	},
}
</script>

<style>
.header {
	background-color: #409eff;
	color: #fff;
	line-height: 20px;
}

.content {
	font-size: 16px;
}
</style>
